<!-- pages/njt/user/UserHome.vue -->
<template>
  <view class="container">
    <!-- 功能宫格 -->
    <u-grid :col="3" :border="false">
      <u-grid-item class="grid-item" v-for="(ListItem,ListIndex) in List" :key="ListIndex"
                   @click="handleClick(ListItem)">
        <text class="grid-text">{{ ListItem.title }}</text>
      </u-grid-item>
    </u-grid>
    <!-- 打印合格证 Popup -->
    <u-popup
        :show="showPrintPopup"
        mode="center"
        border-radius="14"
        :close-on-click-overlay="true"
        @close="showPrintPopup = false">
      <view style="padding: 40rpx; text-align: center; min-width: 400rpx;">
        <text style="font-size: 32rpx; font-weight: bold;">重要提示</text>
        <!-- 显示提示信息 -->
        <view style="margin-top: 30rpx; text-align: left;">
          <text>您还不是会员，资料完善后即可成为会员，是否立即完善？</text>
        </view>

        <!-- 操作按钮 -->
        <view style="margin-top: 40rpx; display: flex; justify-content: space-around;">
          <u-button type="error" size="mini" @click="showPrintPopup = false">取消</u-button>
          <u-button type="primary" size="mini" @click="goPerfectInfo">确认</u-button>
        </view>
      </view>
    </u-popup>

    <!-- tabbar -->
    <view class="tabbar">
      <u-tabbar
          v-model="currentIndex"
          :value="currentIndex"
          :fixed="true"
          :placeholder="false"
          :safeAreaInsetBottom="true"
          activeColor="#3cc51f">
        <u-tabbar-item v-for="(item,index) in tablist" :key="index"
                       @click="switchTab(item)"
                       :text="item.text" :icon="item.name" :name="item.name"></u-tabbar-item>
      </u-tabbar>
    </view>
  </view>
</template>

<script>
import {useUserStore} from '@/store/user';

export default {
  data() {
    return {
      currentIndex: "home",
      tablist: [
        {
          "pagePath": "pages/njt/user/UserHome",
          "name": "home",
          "text": "首页"
        },
        {
          "pagePath": "pages/njt/user/UserInfo",
          "name": "account",
          "text": "个人"
        }
      ],
      List: [{
        title: '打印合格证',
        click: 'print'
      },
        {
          title: '打印列表',
          click: 'printList'
        }
      ],
      showPrintPopup: false
    }
  },
  computed: {
    // 响应式获取 Pinia store
    userStore() {
      return useUserStore()
    }
  },
  onLoad() {
    uni.hideTabBar()
  },
  methods: {
    // 调用对应 Grid 的点击事件
    handleClick(item) {
      if (item.click && typeof this[item.click] === 'function') {
        this[item.click]()
      }
    },
    // 打印合格证
    print() {
      if (this.userStore?.user?.perfectFlag === 0) {
        this.showPrintPopup = true
        return
      }
      uni.navigateTo({
        url: 'PrintCert'
      })
    },
    // 打印列表
    printList() {
      if (this.userStore?.user?.perfectFlag === 0) {
        this.showPrintPopup = true
        return
      }
      uni.navigateTo({
        url: 'PrintList'
      })
    },
    // 跳转完善信息页面
    goPerfectInfo() {
      this.showPrintPopup = false
      uni.navigateTo({
        url: 'PerfectInfo'
      })
    },
    // tabbar页面跳转
    switchTab(item) {
      uni.switchTab({
        url: "/" + item.pagePath,
      })
    }
  }
}
</script>

<style>
</style>